<template>
    <div>
        <h1>会员注册页面</h1>
        <table class="table">
            <thead>
                <tr>
                    <td>会员名称</td>
                    <td>
                        <input type="text" v-model="data.Name">
                    </td>
                </tr>
                <tr>
                    <td>会员密码</td>
                    <td>
                        <input type="password" v-model="data.Password">
                    </td>
                </tr>
                <tr>
                    <td>会员性别</td>
                    <td>
                        <input type="radio" v-model="data.Sex" name="sex" value="1">男
                        <input type="radio" v-model="data.Sex" name="sex" value="2">女
                    </td>
                </tr>
                <tr>
                    <td>会员爱好</td>
                    <td>
                        <span v-for="b in arr">
                            <input type="checkbox"  v-model="hb" :value="b">{{ b }}
                        </span>
                    </td>
                </tr>
                <tr>
                    <td>会员图片</td>
                    <td >
                        <input type="file" @change="shang" >
                        <img :src="'https://localhost:7076/'+data.img" style="width: 100px;height: 100px;">
                    </td>
                </tr>
                <tr>
                    <td>会员等级Id</td>
                    <td>
                        <select  v-model="data.MemberLevelId">
                            <option value="0">请选择</option>
                            <option v-for="a in xlk" :value="a.DId">{{ a.DName }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="保存" @click="add">
                    </td>
                </tr>
            </thead>
        </table>
    </div>
</template>
<script setup lang="ts">
import {onMounted, ref} from "vue";
import axios from "axios";
import { useRoute, useRouter } from "vue-router";
//实例化
const router=useRouter();
const data=ref({
    
  "HId": 0,
  "Name": "",
  "Password": "",
  "Sex": 0,
  "Lovecount": 0,
  "Love": "",
  "IsDelete": true,
  "img": "",
  "MemberLevelId": 0,
  "CreateData": "2025-04-10T12:16:01.964Z"
});
const shang=(e:any)=>{
    var n=e.target.files[0];
    var fn=new FormData();
    fn.append("file",n);
    if(n.size>1024*1024*2)
    {
        alert("上传图片不能大于2MB");
        return;
    }
    debugger
    if(n.type!="image/png" && n.type!="image/jpeg" )
    {
        alert("上传图片只能是PNG和jpeg")
        return;
    }
    axios.post("https://localhost:7076/api/inigo",fn).then(res=>{
        data.value.img=res.data;
    })
}
onMounted(()=>{
    bang();
})
const arr=(["游戏","锻炼","工作","赚钱"]);
const hb=ref([]);
//下拉框
const xlk=ref([
{
    "DId": 0,
    "DName": ""
  }
]);
const bang=()=>{
    axios.get("https://localhost:7076/api/Hui/Bang").then(res=>{
        xlk.value=res.data;
    })
}
//添加
const add=()=>{
    data.value.Love=hb.value.toString();
    data.value.Lovecount=hb.value.length;
    axios.post("https://localhost:7076/api/Hui/AddHui",data.value).then(res=>{
        if(res.data>0)
        {
            alert("添加成功");
            router.push({path:"/"});
        }
        else
        {
            alert("添加失败");
        }
    })
}

</script>

<style scoped>

</style>